<!-- @ 模版最后删除 -->
<template>
	<view class="bg-white padding-bottom-xl" style="min-height: 100vh;">
		<u-notify ref="uNotify" />
		<loadFlex :loading="loading" />
		<uni-nav-bar dark :fixed="true" color="#fff" background-color="#013E8E" title="新增维护单">
			<view style="width: 100%;height: 100%;font-size: 34rpx;" class="flex justify-center align-center">
				<view class="flex justify-center align-center">
					<!-- <image src="../../static/icon/ZY.png" class="margin-right-xs" style="width: 45rpx;height: 45rpx;" /> -->
					苏州恒鑫服务费减免申请表
				</view>
			</view>
		</uni-nav-bar>
		<uni-forms ref="valiForm" class="padding-top padding-lr-sm" :rules="rulesFrom" :modelValue="model"
			labelWidth="375px" label-position="top">
			<view class="flex justify-between align-center">
				<view @click="handStaging(2)" style="width: 49%;">
					<uni-forms-item required name="orderStartDate">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/2.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>编号</text>
							</view>
						</template>
						<uni-easyinput disabled v-model="model.id" placeholder="请输入编号"></uni-easyinput>
					</uni-forms-item>
				</view>
				<view style="width: 49%;">
					<uni-forms-item required name="createTime">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/3.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>申报日期</text>
							</view>
						</template>
						<uni-easyinput disabled style="pointer-events: none;background-color: #fff !important"
							v-model="model.createTime" placeholder="请选择预计日期" />
					</uni-forms-item>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<view style="width: 33%;">
					<uni-forms-item required name="customerName">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/1.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>姓名</text>
							</view>
						</template>
						<uni-easyinput disabled v-model="model.customerName" placeholder="请输入姓名"></uni-easyinput>
					</uni-forms-item>
				</view>
				<view style="width: 33%;">
					<uni-forms-item required name="sex">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/4.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>性别</text>
							</view>
						</template>
						<uni-easyinput v-model="model.sex" placeholder="请输入性别"></uni-easyinput>
					</uni-forms-item>
				</view>
				<view style="width: 33%;">
					<uni-forms-item required name="age">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/6.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>年龄</text>
							</view>
						</template>
						<uni-easyinput v-model="model.age" maxlength="3" placeholder="请输入年龄"></uni-easyinput>
					</uni-forms-item>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<view style="width: 49%;">
					<uni-forms-item required name="belongingTo">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/5.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>联系电话</text>
							</view>
						</template>
						<uni-easyinput disabled v-model="model.phone" maxlength="11"
							placeholder="请输入联系电话"></uni-easyinput>
					</uni-forms-item>
				</view>
				<view style="width: 49%;">
					<uni-forms-item required name="card">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/7.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>身份证号</text>
							</view>
						</template>
						<uni-easyinput v-model="model.card" maxlength="18" placeholder="请输入身份证号"></uni-easyinput>
					</uni-forms-item>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<view style="width: 49%;">
					<uni-forms-item required name="belongingTo">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/5.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>户籍地址:</text>
							</view>
						</template>
						<uni-easyinput v-model="model.registerAddress" placeholder="请输入户籍地址"></uni-easyinput>
					</uni-forms-item>
				</view>
				<view style="width: 49%;">
					<uni-forms-item required name="card">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/7.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>居住地址:</text>
							</view>
						</template>
						<uni-easyinput v-model="model.liveAddress" placeholder="请输入居住地址"></uni-easyinput>
					</uni-forms-item>
				</view>
			</view>
			<uni-forms-item required name="username">
				<template #label>
					<view class="flex align-center" style="height: 40px;">
						<i class="icon-required">*</i>
						<img src="../../static/orderFilling/8.png" class="margin-lr-xs"
							style="width:15px;height: 15px;font-size: 36rpx;" />
						<text>申请事项</text>
					</view>
					<view class="text-red text-sm">
						请求对以下服务费用给予优惠:
					</view>
				</template>
				<uni-data-checkbox mode="button" v-model="model.serviceType" :localdata="dataRadio"></uni-data-checkbox>
			</uni-forms-item>
			<uni-forms-item required name="projectTitle">
				<template #label>
					<view class="flex align-center" style="height: 40px;">
						<i class="icon-required">*</i>
						<img src="../../static/orderFilling/10.png" class="margin-lr-xs"
							style="width:15px;height: 15px;font-size: 36rpx;" />
						<text>申请理由(请简要说明原因，可证明材料)</text>
					</view>
				</template>
				<uni-easyinput :maxlength="-1" v-model="model.reason" type="textarea"
					placeholder="请输入申请理由"></uni-easyinput>
			</uni-forms-item>
			<view class="flex justify-between align-center">
				<view style="width: 49%;">
					<uni-forms-item required name="loanTotalAmount">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/9.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>总债务金额</text>
							</view>
						</template>
						<uni-easyinput v-model="model.loanTotalAmount" maxlength="11"
							placeholder="请输入总债务金额"></uni-easyinput>
					</uni-forms-item>
				</view>
				<view style="width: 49%;">
					<uni-forms-item required name="loanPreAmount">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/11.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>原服务费</text>
							</view>
						</template>
						<uni-easyinput v-model="model.loanPreAmount" maxlength="18"
							placeholder="请输入原服务费"></uni-easyinput>
					</uni-forms-item>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<view style="width: 49%;">
					<uni-forms-item required name="reduction">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/12.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>减免比例/金额%(或￥)</text>
							</view>
						</template>
						<uni-easyinput v-model="model.reduction" maxlength="11" placeholder="请输入总债务金额"></uni-easyinput>
					</uni-forms-item>
				</view>
				<view style="width: 49%;">
					<uni-forms-item required name="reductionMoney">
						<template #label>
							<view class="flex align-center" style="height: 40px;">
								<i class="icon-required">*</i>
								<img src="../../static/orderFilling/13.png" class="margin-lr-xs"
									style="width:15px;height: 15px;font-size: 36rpx;" />
								<text>减免后金额</text>
							</view>
						</template>
						<uni-easyinput v-model="model.reductionMoney" maxlength="18"
							placeholder="请输入原服务费"></uni-easyinput>
					</uni-forms-item>
				</view>
			</view>
			<view>
				<view class="text-blod text-black">注意事项:</view>
				<view class="text-red text-sm padding-top-sm">
					1.提供相关证明材料(如有经济困难证明、收入证明等)
				</view>
				<view class="text-red text-sm padding-top-xs">
					2.申请人承诺:所填信息真实，如虚假陈述将全额补缴费用并承担法律责任
				</view>
			</view>

			<view>
				<uni-forms-item required name="yyRunRealname">
					<template #label>
						<view class="flex align-center" style="height: 40px;">
							<i class="icon-required">*</i>
							<img src="../../static/orderFilling/15.png" class="margin-lr-xs"
								style="width:15px;height: 15px;font-size: 36rpx;" />
							<text>申报人</text>
						</view>
					</template>
					<uni-easyinput disabled v-model="model.yyRunRealname" maxlength="11"
						placeholder="请输入申报人"></uni-easyinput>
				</uni-forms-item>
			</view>
			<view>
				<uni-forms-item required name="yyRunRealname">
					<template #label>
						<view class="flex align-center" style="height: 40px;">
							<i class="icon-required">*</i>
							<img src="../../static/orderFilling/1.png" class="margin-lr-xs"
								style="width:15px;height: 15px;font-size: 36rpx;" />
							<text>申报人签字</text>
						</view>
					</template>
					<jushi-signature base64 :settings="settings" @change="uploadBlob"></jushi-signature>

				</uni-forms-item>
			</view>
			<view v-if="model.status !=0">
				<view class="text-red text-bold margin-top-lg">
					审批结果
				</view>
				<uni-forms-item required name="examineType">
					<template #label>
						<view class="flex align-center" style="height: 40px;">
							<i class="icon-required">*</i>
							<img src="../../static/orderFilling/8.png" class="margin-lr-xs"
								style="width:15px;height: 15px;font-size: 36rpx;" />
							<text>审批意见</text>
						</view>
					</template>
					<uni-data-checkbox disabled v-model="model.examineType"
						:localdata="dataOpinion"></uni-data-checkbox>
				</uni-forms-item>
				<uni-forms-item required name="examineMoney">
					<template #label>
						<view class="flex align-center" style="height: 40px;">
							<i class="icon-required">*</i>
							<img src="../../static/orderFilling/8.png" class="margin-lr-xs"
								style="width:15px;height: 15px;font-size: 36rpx;" />
							<text>调整后金额</text>
						</view>
					</template>
					<uni-easyinput disabled v-model="model.examineMoney" maxlength="18"
						placeholder="请输入调整后金额"></uni-easyinput>
				</uni-forms-item>
			</view>
		</uni-forms>
		<view style="width: 100%;" class="flex justify-around margin-top">
			<view class="cu-btn round bg-blue2" style="width: 80%" @click="portuniOpen">
				确定申报</view>
		</view>
		</uni-forms>
		<uni-calendar ref="refStaging" :insert="false" @confirm="ConfirmStaging" />
	</view>
</template>
<script>
	import myApi from '@/utils/app.js' //调用接口使用
	import loadFlex from '@/components/loadFlex/loadFlex.vue' //加载框
	export default {
		name: 'Application',
		components: {
			loadFlex
		},
		data() {
			return {
				model: {

				},
				loading: false,
				settings: { //签名设置
					width: '750', //签名区域的宽
					height: '450', //签名区域的高
					lineWidth: 1, //签名时线宽
					textColor: '#000' //签名文字颜色
				},
				dataRadio: [{
						value: '0',
						text: "民事纠纷服务"
					},
					{
						value: "1",
						text: "非诉讼服务"
					},
					{
						value: "2",
						text: "其他"
					},

				],
				dataOpinion: [{
						value: '0',
						text: "同意优惠申请，按上述金额执行"
					},
					{
						value: "1",
						text: "部分同意"
					},
				],
				dataIndex: 0,
				rulesFrom: {},
			}
		},
		onLoad(options) {
			console.log(111111111111111)
			if (options.orderFilling) {
				try {
					// 解析传递过来的字符串
					const objStr = options.orderFilling;
					const parsed = JSON.parse(objStr);
					this.model = parsed
					console.log(22222222222)
					console.log(this.model)
				} catch (error) {
					console.log(3333333333333)
					console.error('解析数据时出错:', error);
				}
			}
		},
		methods: {
			uploadBlob(e){
				console.log(e)
			},
			onNotify(round) { // 提示
				this.$refs.uNotify.show({
					type: round.type ? round.type : 'success',
					message: round.message ? round.message : '操作成功',
					top: 50
				})
			},
			async portuniOpen(item, index) {
				this.loading = true
				try {
					const res = await this.$request({
						url: myApi.customerLoad,
						method: 'post',
						data: this.model
					});
					if (res.code == 200) {
						this.onNotify({})
						setTimeout(() => (
							uni.reLaunch({
								url: '/pages/successful/successful'
							})), 400);
					}
				} catch (e) {
					// 失败执行
					console.log(`这个接口错误：${myApi.goodsList}`)
				} finally {
					// 销毁执行
					this.loading = false
				}
			},
		}
	}
</script>
<style lang="scss" scoped>

</style>